#{extends 'main.html' /}	
#{set 'moreScripts'}
#{script 'resize.js'/}
#{/set}	
<script>
$(document).ready(function() {
	$('textarea').autoGrow();
	function closemsg(){
		$('#tempmsg').remove();
		$(".backgr").remove();
	}
	$('#BuToSend').click(function(){
		$("#top_links").
		append('<div class="backgr" style="width: 100%;height: 100%;background-color:black;position:fixed;left: 0;top: 0;opacity:0.3"></div>');
		$("#top_links").
		append('<div id="tempmsg" style="padding:15px;background-color:#b0b0b0;box-shadow: 0 0 10px rgba(0,0,0,0.5);border-radius:5px; width: 250px;position:fixed; left:40%;top:30%" align="center"><h2 class="h2inmsg">Send Messages</h2><textarea placeholder="Some text..." rows="2"class="inputstyle" style="width:240px;; outline: 0;resize:none; overflow:hidden;height:auto;"></textarea><a class="buttonclass" id="Sendmess" style="font-size: 12px;margin-top: 7px;">Send</a><a class="buttonclass" id="CloseSM" style="font-size: 12px;margin-left:10px;margin-top: 7px;">Close</a></div>');
		$("#tempmsg textarea").autoGrow();
		$("#tempmsg #CloseSM").click(function(){
			closemsg();
		});
		$('#Sendmess').click(function(){
			var text=$("#tempmsg textarea").val();
			var to="${group.id}";
			if($.trim(text)!="")
				{
				$.ajax({
					  type	: "GET",
					  url	: "",/*Lracnelllllllllllllllll*/
					  data	: {
						  text:text,
						  to	:to,
					  }
				}).done(function( result ){
					if (!result.error) {
						$('#tempmsg').html("<h2 class='h2inmsg'>Message was sent</h2>");
					}
					setTimeout('closemsg()', 1200);
				})
				}else console.error("text is not written");
		});//sendmess 
	});//buToSend
	$('#post_send').click(function(){
		var text=$("#post_area").val();
		var id="${group.id}";
		if($.trim(text)!="") 
		{
		$.ajax({
			  type	: "GET",
			  url	: "",/*lracraaaaaaaaaaaaaaaaaaa*/
			  data	: {
				  post:text,
				  id	:id,
			  }
		}).done(function(result){
			console.log(result);
			window.location.reload();
		})
		}console.error("text is not written");
	});
})//doc ready
</script>
<div id="main-content-head">
	<div id="main-content-head-title">
		<b>${group.name}</b>										
	</div>
	<div class="cleaner" ></div>
</div>
			<div id="main-content-profile-left">
				<div id="profile-avatar">
					<img src="/public/images/default_avatar.png" width="250px"/>
				</div>
				<div id="profile-actions" style="margin-top: 15px" align="center">
					<a class="buttonclass" id="BuToSend"  style="font-size: 15px;"> Send message</a>
				</div>
				<div class="profile-friends" id="group">
					<div class="profile-friends-title">
						Members
					</div>
						<div style="width: 209;margin-left: 10px;margin-top: 10px;" align="left">
						#{list items:members, as:'members'}
							<div style="float: left; margin-left: 5px; margin-top: 5px; width: 73.9px">
								<a href="/profile/${members.id}"  style="color:black;text-decoration: none;">
									<img src="/public/DataOfImages/${members.prphoto}" style="width: 73.9px ;height: 60px;"/>
									<div style="font-size: xx-small; text-align: center;width: 73.9px;overflow: hidden; height: 12px;">
										${members.name}
									</div>
								</a>
							</div>
						 #{/list}
						 <div class="cleaner"></div>
					</div>
					<span class="more"><a href="/memb" class="walluser">All members</a></span>
				</div>
			</div>
			<div id="main-content-profile-right">
				<div id="profile-right-info">
					<div id="profile-right-info-top" align="center">
						${group.name}
					</div>
				</div>
			<div id="profile-right-wall-wrap">
					<div style="background:#989898 ">
						<div class="profile-right-block-head">
							Status
						</div>
						<div style="width: 500px;margin: 0 auto;padding-top: 5px;padding-right: 3px;">
						<span>Publication</span>
						<textarea id="post_area" style="margin:0;padding:0; width:100%;outline: none;outline: 0;resize:none;overflow: hidden;"></textarea>
						<a class="buttonclass" id="post_send" style="float: right;margin-right: 10px; margin-bottom: 5px;" >Post</a>
						 <div class="cleaner"></div>						
						</div>
					</div>
					#{list items:wallpost, as:'temp'}
						<div id="profile-right-wall-post">
							<span>post from <a href="/profile/${temp.fromId}" class="walluser">${temp.Toname}</a></span>		
							<div align="left" style="">											
								<p style="font-size: medium;">${temp.post}</p>
							</div>
					
							<div class="comment_wrap">
								<div class="comment_wrap_head">
									<h5>Comments</h5>
									<div style="height: 18px;line-height: 18px; float: right;">
										<a class="down_comment" href="##" id="comment_action">View</a>
										<a class="up_comment" href="##" id="comment_action">Hide</a>
									</div>
									<div class="cleaner"></div>
								</div>		
								  <div class="comment_slide" style="display: none;">
									<div class="comment_post">	<!-- Add comment -->
										<div class="comment_from_user">
											<a href="/profile/}"  class="name_of_memb">
												<img src="/public/images/default_avatar.png" width="40" height="25"/>
												<div style="font-size: xx-small; text-align: center;width: 40px;overflow: hidden; height: 12px;">
													Grigor Grigoryan
												</div>
											</a>
										</div>	
										<div class="comment_add"id="aaa">
											<textarea style="margin:0; width:390px;outline: none;outline: 0;resize:none;overflow: hiden;"></textarea>
											<a class="buttonclass" style="float: right;" id="add_comment_button" >Add Commnet</a>
										</div>
										<div class="cleaner"></div>					
									</div><!-- End of Add comment -->
									<div class="comment_post" style="">
										<div class="comment_from_user">
											<a href="/profile/}"  class="name_of_memb">
												<img src="/public/images/default_avatar.png"/>
												<div style="font-size: xx-small; text-align: center;width: 40px;overflow: hidden; height: 12px;">
													Grigor Grigoryan
												</div>
											</a>
										</div>	
										<div class="comment_text">
											esi pordzna
										</div>
										<a class="close" style="position: absolute;margin-left:430px;margin-top: -15px;" title="Delete"></a>
										<div class="cleaner"></div>					
									</div>
									<div class="comment_post" style="">
										<div class="comment_from_user">
											<a href="/profile/}"  class="name_of_memb">
												<img src="/public/images/default_avatar.png"/>
												<div style="font-size: xx-small; text-align: center;width: 40px;overflow: hidden; height: 12px;">
													Grigor Grigoryan
												</div>
											</a>
										</div>	
										<div class="comment_text">
											esi pordzna
										</div>
										<a class="close" style="position: absolute;margin-left:430px;margin-top: -15px;" title="Delete"></a>
										<div class="cleaner"></div>					
									</div>	
								<div class="cleaner"></div>					
							</div>
						</div>
						</div>
					#{/list}
					#{else}	<div id="profile-right-wall-post"><h3 align="center">Wall of this group is empty</h3></div>#{/else}
				</div>
			</div>
<div class="cleaner" ></div>
